import React from 'react';
import { Button, Modal, message } from 'antd';
import { inject, observer } from 'mobx-react';
import { WeaTop, WeaTab, WeaLeftRightLayout, WeaRightMenu, WeaPopoverHrm, WeaTools, WeaErrorPage, WeaDialog,WeaNewScroll } from 'ecCom';
import { observable, action, toJS } from 'mobx';
import { WeaTableNew } from 'comsMobx';
import { Condition, getAdButtons } from './ListCondition';
import MyPlanListInfoDialog from "./MyPlanListInfoDialog"

const WeaTable = WeaTableNew.WeaTable;
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

@inject("myInventoryStore")
@observer
class MyCptInventoryList extends React.Component {
    constructor(props) {
        super(props);
    }
    doInit(props) {
        const { location, myInventoryStore } = props;
        const { appendBaseParams, doSearch, initDatas } = myInventoryStore;
        initDatas();//高级查询
        doSearch();// 查找盘点计划
    }
    componentDidMount() {
        this.doInit(this.props);
    }

    componentWillReceiveProps(nextProps) {
        if (this.props.location.key !== nextProps.location.key) {
            const { myInventoryStore } = this.props;
            const {form } = myInventoryStore;
            form.resetConditionValue(); 
            myInventoryStore.clearStatus();
            this.doInit(nextProps);
        }
    }
    shouldComponentUpdate(nextProps, nextState) {
        return true;
    }
    componentWillUnmount() {
        const { myInventoryStore } = this.props;
        const {form } = myInventoryStore;
        form.resetConditionValue(); 
        myInventoryStore.clearStatus();
    }
    render() {
        const { myInventoryStore } = this.props;
        const { loading, dataKey, tableStore, searchParams, form, setVisiable, showSearchAd } = myInventoryStore;
        const formParams = form.getFormParams() || {};
        const tableNow = this.getCurrentTable();
        const loadingTable = tableNow.loading;
        const topTab = [
            { title: getLabel(384644,'待盘点'), key: "0" },
            { title: getLabel(510662,'历史盘点记录'), key: "1" },
        ];

        return (
            <div>
                <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@tdgxd5`}
                    title={getLabel( 383831 ,"我的盘点表")}
                    loading={loading || loadingTable}
                    icon={<i className='icon-coms-fa' />}
                    iconBgcolor='#f14a2d'
                >

                    <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@waf6rp`} //高级搜素
                        datas={topTab}
                        keyParam="key"  //主键
                        showSearchAd={showSearchAd}
                        selectedKey={ searchParams.tabkey }
                        buttonsAd ={ searchParams.tabkey == "1"  && getAdButtons(myInventoryStore)}
                        searchType={searchParams.tabkey == "1"  && ['base','advanced']}
                        onChange={(key)=>{myInventoryStore.changeTab(key)} }
                        searchsBaseValue={formParams.flowTitle}
                        setShowSearchAd={bool => myInventoryStore.setShowSearchAd(bool)}
                        hideSearchAd={()=> myInventoryStore.setShowSearchAd(false)}
                        onSearch={v => { myInventoryStore.doSearch() }}
                        showSearchDrop={false}
                        searchsAd={
                            <div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@k1l397`} listStore={myInventoryStore} form={form} onEnterSearch={this.onEnterSearch}></Condition></div>
                        }
                        onSearchChange={v => { myInventoryStore.appendFormFields({ flowTitle: v }) }}
                    />

                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@32rxpo`} datas={this.getRightMenu()}>
                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@y4mz46`}
                            sessionkey={dataKey}
                            comsWeaTableStore={tableStore}
                            hasOrder={true}
                            needScroll={true}
                            onOperatesClick={this.onOperatesClick.bind(this)}
                            getColumns={c => this.reRenderColumns(c)}
                        />
                       
                        <MyPlanListInfoDialog ecId={`${this && this.props && this.props.ecId || ''}_MyPlanListInfoDialog@nnl7r5`} contentStore={myInventoryStore} />
                       
                    </WeaRightMenu>
                </WeaTop>

            </div>
        )
    }

    reRenderColumns(columns) {
        const { myInventoryStore } = this.props;
        var divStyle = {
            cursor:'pointer'
        };
        columns.forEach(c => {
            if (c.dataIndex == 'mark' || c.dataIndex == 'name') {
                c.render = function (text, record) {
                    let valueSpan = record[c.dataIndex + "span"] !== undefined ? record[c.dataIndex + "span"] : record[c.dataIndex];
                    return <span style={divStyle} onClick={() => {
                        myInventoryStore.setSelectId({ selectid: record.randomFieldId });
                        myInventoryStore.handleDialog(true, { id: record.randomFieldId, name: record.name }, 0)
                    }}
                        dangerouslySetInnerHTML={{ __html: valueSpan }}>
                    </span>
                }
            }
        })
        return columns;
    }

    onOperatesClick = (record, index, operate, flag, argumentString) => {
        const { myInventoryStore } = this.props;
        let _href = operate && operate.href ? operate.href : "";
        let fn = _href.replace("javascript:", "");
        fn = fn.substring(0, fn.indexOf('('));
        let that = this;
        if (fn != "") {
            if ("onViewDetail" == fn) {
                myInventoryStore.setSelectId({ selectid: record.randomFieldId });
                myInventoryStore.handleDialog(true, { id: record.randomFieldId, name: record.name }, 0);
            } else if ("onSubmit" == fn) {
                Modal.confirm({
                    title: getLabel(15172,'系统提示'),
                    content: getLabel('384670',"提交之后将无法修改已盘点的数据,是否提交?"),
                    onOk() {
                        myInventoryStore.onSubmit({ id: record.randomFieldId });
                    },
                    onCancel() { },
                });
            }
        }
    }
    getCurrentTable() {
        const { myInventoryStore } = this.props;
        const { dataKey, tableStore } = myInventoryStore;
        const tableKey = dataKey ? dataKey.split('_')[0] : "init";
        return tableKey;
    }

    getRightMenu() {
        const { myInventoryStore } = this.props;
        const { tableStore, dataKey, setVisiable } = myInventoryStore;
        const tableNow = this.getCurrentTable();
        const selectedLen = tableStore.selectedRowKeys.length;
        const totalLen = tableNow.count;
        let btns = [];
        return btns;
    }

    onEnterSearch = () =>{
        const { myInventoryStore } = this.props;
        myInventoryStore.doSearch();
        myInventoryStore.setShowSearchAd(false);
    }

}

export default WeaTools.tryCatch(React,
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@jkkcqy`} msg={props.error ? props.error : getLabel( 383324,'对不起，该页面异常，请联系管理员' )} />,
    { error: "" }
)(MyCptInventoryList);